/**index.wxss**/
.home {
  .page-content {
    .gray-text{
      font-size: 28rpx;
      font-weight: 500;
      color: #807F84;
    }
    .orange-text{
      color:#F49A55;
      font-size:34rpx;
    }
    .blue-text{
      color:#2a81be
    }
    // padding-bottom: 100rpx;
    // padding-left:30rpx;
    // padding-right:30rpx;
    padding-bottom:180rpx;
    box-sizing: border-box;
    .container {
      width: 100%;
      height: 100%;
      overflow: auto;
      padding:0 30rpx;
      box-sizing: border-box;
      .top {
        position: relative;
        width: 100%;
        height: 140rpx;
        display: flex;
        .top-bg {
          width: 100%;
          height: 100%;
        }

        .top-title {
          position: absolute;
          left: 0;
          width: 100%;
          font-size: 28rpx;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 400;
          color: #000;
          display: flex;
          align-items: center;
          // justify-content: center;
          // border:1px solid red;
          image {
            width: 28rpx;
            height: 28rpx;
            margin-right: 5rpx;
          }
        }
      }

      .banner {
        width: 100%;
        height: 380rpx;
        // position: relative;

        .banner-image {
          // position: absolute;
          // left: 50%;
          width: 100%;
          height: 380rpx;
          // transform: translate(-50%, -200rpx);
          // border-radius: 10rpx;
        }
      }

      .notice {
        // margin: 26rpx 0;
        display: flex;
        align-items: center;
        box-sizing: border-box;
        margin-top:30rpx;
        // background-color: #fff;
        // position:fixed;
        // top:110rpx;
        // left:30rpx;
        // height:100rpx;
        image {
          width: 28rpx;
          height: 28rpx;
          margin-right: 5rpx;
        }

        font-size: 28rpx;
        font-weight: 400;
        color: #000;
      }

      .location {
        // padding: 0 26rpx;
        margin-top:30rpx;
        display: flex;
        align-items: center;
        margin-bottom: 20rpx;

        .location-city {
          padding: 0 18rpx;
          height: 60rpx;
          border: 1px solid #009643;
          border-radius: 6px;
          display: flex;
          align-items: center;
          margin-right: 16rpx;

          image {
            width: 21rpx;
            height: 28rpx;
            margin-right: 10rpx;
          }

          font-size: 28rpx;
          font-weight: 500;
          color: #009643;
        }

        font-size: 28rpx;
        font-weight: 500;
        color: #807F84;
      }
      .modules-content{
        width:100%;
        padding:40rpx 20rpx;
        margin-top:30rpx;
        border-radius: 10rpx;
        box-sizing: border-box;
        background: linear-gradient(#F2F1FF,#FEFEFF);
        color:rgb(7, 7, 7);
        .content-title{
          // border-left:6rpx  solid #3289F1;
          // padding-left:20rpx;
          margin-bottom:20rpx;
          .title-text{
            font-size:38rpx;
            font-weight:bold;
            margin-top:-6rpx;
            display: inline-block;
            .r-logo{
              width:35rpx;
              height:35rpx;
              // vertical-align: middle;
              margin:-3rpx 4rpx;
            }
          }
          .shu{
            
            width:10rpx;
            height:15rpx;
            border-left:6rpx solid #4CB8FF;
            border-right:6rpx solid #4CB8FF;
            border-radius: 6rpx;
            margin-right:20rpx;
            // margin-top:10rpx;
          }
        }
        .modules-info{
          display: flex;
          justify-content: space-between;
          margin-top:40rpx;
          .modules-img{
            width:220rpx;
            height:140rpx;
            // margin-right:10rpx;
          }
          .order-img{
            width:170rpx;
            height:140rpx;
          }
        }
        .price-table{
          margin-top:30rpx;
          font-size:28rpx;
          .table-line{
            display: flex;
            border-bottom:1px dotted #ddd;
            padding:20rpx 0;
            box-sizing: border-box;
            view{
              width:45%;
            }
          }
          .table-title{
            font-weight:600;
          }
        }
        .liucheng-img{
          margin-top:20rpx;
          width:100%;
          height:566rpx;
        }
      }
      .appoint{
        position: relative;
        .signet-img{
          position: absolute;
          top:30rpx;
          right:30rpx;
          width:138rpx;
          height:122rpx;
        }
      }
      .price-content{
        position: relative;
        .person-img{
          position: absolute;
          bottom:-10rpx;
          right:0rpx;
          width:153rpx;
          height:354rpx;
        }
      }
      .template-content{
        margin-top:20rpx;
        display: flex;
        justify-content: space-between;
        // padding:0 20rpx;
        box-sizing: border-box;
        .template-img{
          width:218rpx;
          height:151rpx;
        }
      }


      .publicity {
        display: block;
        width: 100%;
        height: 3518rpx;
        margin: 20rpx auto;
        // border: 1px solid red;
      }
    }

    .fix-bottom {
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0rpx;
      // height: 100rpx;
      background: #4CB8FF;
      display: flex;
      justify-content: space-between;
      align-items: center;
      box-sizing: border-box;
      padding: 28rpx 76rpx;
      .contact-img{
        width:98rpx;
        height:92rpx;
      }
    }

    .share {
      position: fixed;
      width: 118rpx;
      height: 118rpx;
      right: 30rpx;
      top: 480rpx;
      padding: 0;
      margin: 0;
      border-radius: 50%;
      background: none;

      image {
        width: 100%;
        height: 100%;
      }
    }

    .customer-service {
      position: fixed;
      width: 99rpx;
      height: 99rpx;
      right: 13rpx;
      top: 585rpx;
      padding: 0;
      margin: 0;
      border-radius: 50%;
      background: none;

      image {
        width: 100%;
        height: 100%;
      }
    }

    .qrcode-content {
      padding: 40rpx;
      border-radius: 10rpx;
      background: #fff;
      display: flex;
      flex-direction: column;
      align-items: center;

      .qrcode-image {
        width: 340rpx;
        height: 340rpx;
        // border: 1px solid red;
      }

      .hint {
        margin-top: 30rpx;
        font-size: 28rpx;
        color: #333;
      }
    }
  }
}